/***
 *    Shop Product JavaScriptShop
 **/


$().ready(function () {

    $productListForm = $("#productListForm");
    $pageNumber = $("#pageNumber");
    $pageSize = $("#pageSize");
    $orderType = $("#orderType");
    $viewType = $("#viewType");
    $tableType = $("#tableType");
    $pictureType = $("#pictureType");
    $addFavorite = $(".addFavorite");
    $addCartItem = $(".addCartItem");
    $addCartItemTip = $("#addCartItemTip");
    $tipClose = $("#addCartItemTip .tipClose");
    $addCartItemTipMessageIcon = $("#addCartItemTipMessageIcon");
    $addCartItemTipMessage = $("#addCartItemTipMessage");
    $addCartItemTipInfo = $("#addCartItemTipInfo");

    // 商品分类菜单
    $(".productCategory ul.menu").superfish({
        delay: 100
    });

    // 缩略图滚动栏
    $(".productContent .scrollable").scrollable({
        speed: 600
    });

    // Tab效果
    $(".productContent ul.productImageTab").tabs(".productImage .tabContent", {
        event: "click"// 触发tab切换的事件
    });

    // Tab效果
    $(".productContent ul.productAttributeTab").tabs(".productBottom .tabContent", {
        effect: "fade",// 逐渐显示动画
        fadeInSpeed: 500,// 动画显示速度
        event: "click"// 触发tab切换的事件
    });

    // 商品图片放大镜效果
    $("a.zoom").zoomimage({
        opacity: 0.6,
        controlsTrigger: "mouseover",
        controls: true,
        centered: true,
        hideSource: true
    });

    // 更多商品参数
    var productAttributeTab = $(".productContent ul.productAttributeTab").tabs();
    $("#moreProductAttribute").click(function () {
        var index = productAttributeTab.getIndex();
        if (index == 0) {
            productAttributeTab.next();
        }
    });

    // 每页显示数
    $pageSize.change(function () {
        $pageNumber.val("1");
        $productListForm.submit();
    });

    // 商品排序
    $orderType.change(function () {
        $pageNumber.val("1");
        $productListForm.submit();
    });

    // 列表方式查看
    $tableType.click(function () {
        $viewType.val("tableType");
        $productListForm.submit();
        return false;
    });

    // 图片方式查看
    $pictureType.click(function () {
        $viewType.val("pictureType");
        $productListForm.submit();
        return false;
    });

   /* $(document).on('click','.sys_spec_text > li',function () {
        $_this = $(this);
        // $_this.addClass('selected').siblings().removeClass('selected');

        var selectedGg = $('.sys_spec_text').children('.selected');//选中的规格
        var specificationValueIds = '';
        $(selectedGg).each(function (index, item) {
            specificationValueIds += $(this).attr('data-aid') + ','
        });
        $.ajax({
            url: "/b/pc/specification/getSkuPrice",
            data: {
                "specificationtype":$('.specificationtype').val(),
                "specificationValueIds": specificationValueIds},
            dataType: "json",
            success: function (data) {
                if (data.state == "ok") {
                    if (data.num < 1) {
                        $_this.removeClass('selected');
                        // baseInfo.eq(index).text("");
                        // layer.msg("当前商品无货");
                        return;
                    }
                    // baseInfo.eq(index).text($_this.text());
                    $(".price").text(data.price);
                    // $(".spec-sku").find("span").eq(1).text(data.num);
                } else if (data.status == "error") {
                    // layer.open({
                    //     content: data.message
                    //     , btn: '确定'
                    // });
                }
            }
        });
    });*/

    // 添加商品至购物车
    $addCartItem.click(function () {

        var quantity = $('.Amount').val();//购买数量

        var selectedGg = $('.sys_spec_text').children('.selected');//选中的规格
        var allValueIds = $('.sys_item_specpara').length;//总规格
        var needSelected = selectedGg.length;
        if (needSelected < allValueIds) {
            $.tip("请选择产品规格");
            return false;
        }
        var specificationValueIds = '';
        $(selectedGg).each(function (index, item) {
            specificationValueIds += $(this).attr('data-aid') + ','
        });
        var $this = $(this);
        var id = $this.metadata().id;

        var x = $this.offset().left - 50;
        var y = $this.offset().top + $this.height() + 6;
        $addCartItemTip.css({"left": x, "top": y});
        if (quantity == null) {
            quantity = 1;
        }
        var reg = /^[0-9]*[1-9][0-9]*$/;
        if (!reg.test(quantity)) {
            $addCartItemTipMessageIcon.removeClass("successIcon").addClass("errorIcon");
            $addCartItemTipMessage.text("加入购物车失败！");
            $addCartItemTipInfo.text("商品数量必须为正整数！");
            $addCartItemTip.fadeIn();
            return false;
        }
        $.ajax({
            url: JFinalshop.base + "/b/pc/cartItem/ajaxAdd",
            data: {"id": id, "quantity": quantity, "specificationValueIds": specificationValueIds},
            dataType: "json",
            beforeSend: function () {
                $this.attr("disabled", true);
            },
            success: function (data) {
                $.flushCartItemList();
                if (data.status == "success") {
                    $addCartItemTipMessageIcon.removeClass("errorIcon").addClass("successIcon");
                    $addCartItemTipMessage.text(data.message);
                    $addCartItemTipInfo.text("共计商品：" + data.totalQuantity + "件，总计金额：" + data.totalPrice);
                } else if (data.status == "error") {
                    $addCartItemTipMessageIcon.removeClass("successIcon").addClass("errorIcon");
                    $addCartItemTipMessage.text(data.message);
                    $addCartItemTipInfo.empty();
                }
                $addCartItemTip.fadeIn();
                $this.attr("disabled", false);
            }
        });
    });

    // 添加购物车提示框隐藏
    $tipClose.click(function () {
        $addCartItemTip.fadeOut();
        return false;
    });

    // 产品收藏
    $addFavorite.click(function () {
        var $this = $(this);

        if ($.cookie("loginMemberUsername") == null) {
            $.flushHeaderInfo();
            $.loginWindowShow();
            return false;
        } else {

            var id = $(this).metadata().id;
            $.ajax({
                url: JFinalshop.base + "/b/pc/favorite/addFavorite",
                data: {"productId": id},
                dataType: "json",
                beforeSend: function () {
                    $this.attr("disabled", true);
                },
                success: function (data) {
                    console.log(JSON.stringify(data));
                    $.tip(data.status, data.message);
                    // layer.msg("wewew");

                    $this.attr("disabled", false);

                },
                error: function (data) {
                    if ($.cookie("loginMemberUsername") == null) {
                        $.flushHeaderInfo();
                        $.loginWindowShow();
                        return false;
                    }
                    $this.attr("disabled", false);
                }
            });
        }
    });

    // 添加商品浏览记录
    var maxProductHistoryListCount = 5; // 最大商品浏览记录数
    $.addProductHistory = function (name, htmlFilePath) {
        var productHistory = {
            name: name,
            htmlFilePath: htmlFilePath
        };
        var productHistoryArray = new Array();
        var productHistoryListCookie = $.cookie("productHistoryList");
        if (productHistoryListCookie) {
            productHistoryArray = eval(productHistoryListCookie);
        }
        var productHistoryListHtml = "";
        for (var i in productHistoryArray) {
            productHistoryListHtml += '<li><a href="' + productHistoryArray[i].htmlFilePath + '">' + productHistoryArray[i].name + '</a></li>';
        }
        for (var i in productHistoryArray) {
            if (productHistoryArray[i].htmlFilePath == htmlFilePath) {
                return;
            }
        }
        if (productHistoryArray.length >= maxProductHistoryListCount) {
            productHistoryArray.shift();
        }
        productHistoryArray.push(productHistory);
        var newProductHistoryCookieString = "";
        for (var i in productHistoryArray) {
            newProductHistoryCookieString += ',{name: "' + productHistoryArray[i].name + '", htmlFilePath: "' + productHistoryArray[i].htmlFilePath + '"}'
        }
        newProductHistoryCookieString = "[" + newProductHistoryCookieString.substring(1, newProductHistoryCookieString.length) + "]";
        $.cookie("productHistoryList", newProductHistoryCookieString, {path: "/"});
    }

    // 商品浏览记录列表
    var productHistoryArray = new Array();
    var productHistoryListCookie = $.cookie("productHistoryList");
    if (productHistoryListCookie) {
        productHistoryArray = eval(productHistoryListCookie);
    }
    var productHistoryListHtml = "";
    for (var i in productHistoryArray) {
        productHistoryListHtml += '<li><span class="icon">&nbsp;</span><a href="' + productHistoryArray[i].htmlFilePath + '">' + productHistoryArray[i].name + '</a></li>';
    }
    $("#productHistoryListDetail").html(productHistoryListHtml);

});

//图片放大
;(function () {
    var EventUtil, Get, Element;
    EventUtil = {
        addHandler: function (ele, type, handler) {
            if (ele.addEventListener) {
                ele.addEventListener(type, handler, false)
            } else if (ele.attachEvent) {
                ele.attachEvent("on" + type, handler)
            } else {
                ele["on" + type] = handler;
            }
        },
        removeHandler: function (element, type, handler) {
            if (element.removeEventListener) {
                element.removeEventListener(type, handler, false);
            } else if (element.detachEvent) {
                element.detachEvent("on" + type, handler);
            } else {
                element["on" + type] = null;
            }
        },
        getEvent: function (event) {
            return event ? event : window.event;
        },
        getTarget: function (event) {
            return event.target || event.srcElement;
        },
        preventDefault: function (event) {
            if (event.preventDefault) {
                event.preventDefault();
            } else {
                event.returnValue = false;
            }
        },
        stopPropagation: function (event) {
            if (event.stopPropagation) {
                event.stopPropagation();
            } else {
                event.cancelBubble = true;
            }
        }
    };

    Get = {
        byId: function (id) {
            return typeof id === "string" ? document.getElementById(id) : id
        },
        byClass: function (sClass, oParent) {
            var aClass = [];
            var reClass = new RegExp("(^| )" + sClass + "( |$)");
            var aElem = this.byTagName("*", oParent);
            for (var i = 0; i < aElem.length; i++) reClass.test(aElem[i].className) && aClass.push(aElem[i]);
            return aClass
        },
        byTagName: function (elem, obj) {
            return (obj || document).getElementsByTagName(elem)
        }
    };

    Element = {
        hasClass: function (obj, name) {
            return (' ' + obj.className + ' ').indexOf(' ' + name + ' ') > -1 ? true : false;
        },
        addClass: function (obj, name) {
            if (this.hasClass(obj, name)) return;
            obj.className += ' ' + name;
        },
        removeClass: function (obj, name) {
            obj.className = obj.className.replace(new RegExp('(^|\\s)' + name + '(?:\\s|$)'), '$1').replace(/\s{1,}/g, ' ');
        }
    }

    function MagnifierF() {
        this.init.apply(this, arguments);
    }

    MagnifierF.prototype = {
        init: function (id) {
            var _is = this;
            this.magWrap = Get.byId(id);
            this.magMain = this.magWrap.children[0];
            this.mW = this.magMain.offsetWidth;
            this.mH = this.magMain.offsetHeight;
            this.magImg = this.magMain.getElementsByTagName('img')[0];
            this.mImgSrc = this.magImg.getAttribute('src').slice(0, -4);

            this.specBox = Get.byClass("spec-items", this.magWrap)[0];
            this.specUl = this.specBox.getElementsByTagName('ul')[0];
            this.specItem = this.specBox.getElementsByTagName('li');

            _is.specFn();
            _is.setEventFn().dragEvent();

        },
        setEleFn: function () {
            var _is = this,
                _html1 = "",
                oFrag = document.createDocumentFragment(),
                oFrag2 = document.createDocumentFragment();

            _is.oMD = document.createElement('div');
            _is.oMD.className = "MagnifierDrag";
            _is.oMD.style.cssText = 'width:' + _is.mW / 1.5 + 'px;height:' + _is.mH / 1.5 + 'px;';
            _is.oMD.innerHTML = "&nbsp;";

            _is.oMP = document.createElement('div');
            _is.oMP.className = 'MagnifierPop';
            _is.oMP.style.cssText = 'width:' + _is.mW + 'px;height:' + _is.mH + 'px;right:' + (-_is.mW - 10) + 'px;';

            _is.oMI = document.createElement('div');
            _is.oMI.className = 'MagnifierImg';
            _is.oMI.style.cssText = 'width:' + _is.mW * 1.5 + 'px;height:' + _is.mH * 1.5 + 'px;';
            // _html1 = '<img style="width:100%;height:100%;" src="' + _is.mImgSrc + '_big.jpg">'
            _html1 = '<img style="width:100%;height:100%;" src="' + _is.mImgSrc + '.jpg">'
            _is.oMI.innerHTML = _html1;

            _is.oMP.appendChild(_is.oMI)

            oFrag.appendChild(_is.oMD);
            oFrag2.appendChild(_is.oMP);

            _is.magMain.appendChild(oFrag);
            _is.magWrap.appendChild(oFrag2);

        },
        removeFn: function () {
            var _is = this;
            _is.magMain.removeChild(_is.oMD);
            _is.magWrap.removeChild(_is.oMP);
        },
        setMousemoveFn: function (event) {
            var _is = this,

                _WinScrLeft = document.documentElement.scrollLeft || document.body.scrollLeft,
                _WinScrTop = document.documentElement.scrollTop || document.body.scrollTop;

            _x = event.clientX + _WinScrLeft -
                (_is.magWrap.getBoundingClientRect().left + _WinScrLeft) - _is.oMD.offsetWidth / 2;

            _y = event.clientY + _WinScrTop -
                (_is.magMain.getBoundingClientRect().top + _WinScrTop) - _is.oMD.offsetHeight / 2;

            _l = _is.magMain.offsetWidth - _is.oMD.offsetWidth;
            _t = _is.magMain.offsetHeight - _is.oMD.offsetHeight;

            _l2 = -(_is.oMI.offsetWidth - _is.magMain.offsetWidth);
            _t2 = -(_is.oMI.offsetHeight - _is.magMain.offsetHeight);

            if (_x < 0) {
                _x = 0;
            }
            else if (_x > _l) {
                _x = _l;
            }

            if (_y < 0) {
                _y = 0;
            }
            else if (_y > _t) {
                _y = _t;
            }


            _is.oMD.style.left = _x + "px";
            _is.oMD.style.top = _y + "px";


            _bigx = _x / _l;
            _bigy = _y / _t;


            _is.oMI.style.left = _bigx * _l2 + "px";
            _is.oMI.style.top = _bigy * _t2 + "px";
        },
        setEventFn: function () {
            var _is = this,
                _x = 0,
                _y = 0,
                _l = 0,
                _t = 0,
                _bigx = 0,
                _bigy = 0,
                _l2 = 0,
                _t2 = 0;

            function handleEvent(event) {
                event = EventUtil.getEvent(event);

                switch (event.type) {
                    case "mouseenter":
                        _is.setEleFn();
                        break;
                    case "mousemove":
                        if (_is.oMD) {
                            _is.setMousemoveFn(event);
                        }
                        break;
                    case "mouseleave":
                        _is.removeFn();
                        break;
                }

            }

            return {
                dragEvent: function () {

                    EventUtil.addHandler(_is.magMain, "mouseenter", handleEvent);
                    EventUtil.addHandler(_is.magMain, "mousemove", handleEvent);
                    EventUtil.addHandler(_is.magMain, "mouseleave", handleEvent);
                }
            }

        },
        specFn: function () {
            var _is = this, _oSpImg, _oISrc,
                oLBtn = Get.byClass("spe_leftBtn", _is.magWrap)[0],
                oRBtn = Get.byClass("spe_rightBtn", _is.magWrap)[0],
                oLiW = this.specUl.getElementsByTagName('li')[0].offsetWidth + 5,
                _len = _is.specItem.length,
                n = 0,
                l = null,
                r = null;

            function TabFn(event) {
                var target = EventUtil.getTarget(event),
                    i = 0;

                if (target.nodeName != "UL") {

                    if (target.nodeName == "IMG") {
                        target = target.parentNode;
                    }
                    for (; i < _len; i++) {
                        _is.specItem[i].className = '';
                    }
                    target.className = 'on';

                    _oSpImg = target.getElementsByTagName('img')[0];
                    _oISrc = _oSpImg.getAttribute('src');

                    _is.magImg.setAttribute('src', _oISrc);
                    _is.mImgSrc = _oISrc.slice(0, -4);
                }

            }

            EventUtil.addHandler(_is.specUl, "mouseover", TabFn);

            function moveFn(event) {
                var target = EventUtil.getTarget(event);

                if (target.className.indexOf("spe_rightBtn") > -1) {
                    r = ++n;
                    if (r > _len - 5)
                        Element.removeClass(target, "on");

                    if (r > _len - 4) {

                        n = _len - 4;
                        return false;
                    } else {

                        _is.buttur(_is.specUl, {left: -(r * oLiW)});
                        Element.addClass(oLBtn, "on");
                    }
                }
                if (target.className.indexOf("spe_leftBtn") > -1) {
                    l = --n;
                    if (l < 1)
                        Element.removeClass(target, "on");

                    if (l < 0) {

                        n = 0;
                        return false;
                    } else {

                        _is.buttur(_is.specUl, {left: -(l * oLiW)});
                        Element.addClass(oRBtn, "on");
                    }
                }
            }

            if (_len > 4) {

                Element.addClass(oRBtn, "on");
                EventUtil.addHandler(_is.magWrap, "click", moveFn);
            }


        },
        buttur: function (ele, obj) {

            window.clearTimeout(ele.timer);

            var _this = this,
                end = null;

            for (direc in obj) {

                var direc1 = direc.toLowerCase(),
                    strOffset = "offset" + direc1.substr(0, 1).toUpperCase() + direc1.substring(1).toLowerCase(),
                    target = obj[direc],
                    nSpeed = (target - ele[strOffset]) / 8;

                nSpeed = nSpeed >= 0 ? Math.ceil(nSpeed) : Math.floor(nSpeed);
                ele.style[direc1] = ele[strOffset] + nSpeed + "px";
                end += nSpeed;

            }

            if (end)

                if (typeof fnCallback == "function") {
                    fnCallback.call(ele);
                } else {

                    ele.timer = window.setTimeout(function () {
                        _this.buttur(ele, obj)
                    }, 20);

                }
        }

    }

    window['MagnifierF'] = function (id) {
        return new MagnifierF(id);
    }

})()


window.onload = function () {


    MagnifierF("MagnifierWrap2");

}